<template>
  <el-button link type="primary" @click="handleClick">
    {{ text }}
  </el-button>
</template>

<script setup lang="ts">
import { computed } from 'vue'
import type { RouteLocationRaw } from 'vue-router'
import { useRouter } from 'vue-router'

const props = defineProps<{
  to: RouteLocationRaw | ((row: any) => RouteLocationRaw)
  text?: string
  row?: any
}>()

const router = useRouter()

const routeTarget = computed<RouteLocationRaw>(() => {
  if (typeof props.to === 'function' && props.row) {
    return props.to(props.row)
  }
  return props.to as RouteLocationRaw
})

const handleClick = () => {
  router.push(routeTarget.value)
}
</script>
